
import axios from 'axios'// 引入axios
// import { useStore } from 'vuex' // -----vue3.0中引入路由和vuex
// import { useRouter } from 'vue-router'
// const store = useStore()
// const router = useRouter()// -----------vue3.0中引入路由和vuex
import store from '@/store'
import router from '@/router'

// ---------------------------------------------------------------------请求设置
// 定义一个基准地址(后续还可继续定义)
// export const baseURL = 'http://pcapi-xiaotuxian-front-devtest.itheima.net/'
export const baseURL = 'https://apipc-xiaotuxian-front.itheima.net'
const instance = axios.create({
  // 使用上面的url
  // 响应延迟设置位5秒
  baseURL,
  timeout: 5000
})

// ---------------------------------------------------------------------请求拦截器：
// 1、统一添加请求头Token
// 2、如果已经登录，发送请求时携带token信息
// 3、已经登录，添加请求头
instance.interceptors.request.use((config) => {
  const token = store.state.user.profile.token
  if (token) {
    config.headers.Authorization = 'Bearer ' + token
  }
  return config
}, (err) => {
  return Promise.reject(err)
})

// ---------------------------------------------------------------------响应拦截器:
// 1、对后端返回的数据进行处理；
// 2、处理token失效的问题
// 3、把axios包装的data属性去掉
instance.interceptors.response.use((res) => {
  return res.data
}, (err) => {
// 3、判断token是否失效
// 4、token失效了，清空用户信息，跳转到登录页面
  if (err.response && err.response.status === 401) {
    store.commit('user/setUser', {})
    return router.push('/login')
  }
  return Promise.reject(err)
})

// ------------------------------------
// 导出一个方法
// 调用instance,导出的方法被调用时,
// 传入请求参数options,用参数中的参数,
// 发送请求,然后return出去
export default (options) => {
  return instance({
    method: options.method,
    url: options.url,
    [options.method.toUpperCase() === 'GET' ? 'params' : 'data']: options.data
    // 因为请求方式不同,参数的名字也不同,GET是params,其他是data,所以通过三元表达式判断
    // 并且传入的get(请求方式可能是大写也可能是小写),所以需要处理数据,对象的key可以是动态变量（ES6提供的规则）,对象的key用toUpperCase() 方法做大小写转换

  })
}
